$(function (){
	//初始化jqGrid
	 $("#user-table").jqGrid({
		 url : '/user',
		 datatype : "json",
    colNames : [ "Id",
                 "用户名",
                 "登录账号",
                 "是否可用",
                 "最后登陆时间"
               ],
    colModel : [ 
                {
                    name  : 'id',  //绑定的值
                    index : 'id',   //排序的值
                    width:200
                },
                 {
                      name  : 'name',  //绑定的值
                      index : 'name',   //排序的值
                      width:200
                  },
                  {
                	  name  : 'loginName',
                	  index : 'loginName',
                	  width:200
                  },
                  { 
                	  name    : 'usableFlag',
                	  index   : 'usableFlag',
                	  width:200
                  },
                  { 
                	  name    : 'lastDate',
                	  index   : 'lastDate',
                	  width:200
                  }
				],
				rownumbers : true,//显示行号
				rowNum : 10, //设置表格显示的记录数 
				rowList : [10, 30, 50],//  可选择每页显示的条数
				pager : '#user-pager',// 分页栏ID  必须是div
				viewrecords : true,// 定义是否要显示总记录数
				autowidth : true,
				multiselect: true,
				sortorder : "desc", //默认排序（asc or desc）
			    multiboxonly: true,
			    altRows: true,
				jsonReader : {
					root : 'list',// 结果集
					total : 'totalPage', // 总页数
					page : 'pageNumber', // 页码
					records : 'totalRow', // 总记录数
					repeatitems : false
				},
				loadComplete : function() {
					var table = this;
					setTimeout(function(){
						updatePagerIcons(table);
						enableTooltips(table);
					}, 0);
				},
				height : 200
			});
			 $("#table").jqGrid('navGrid', '#page', {
					edit : false,
					add : false,
					del : false,
					search : false
			});
				function updatePagerIcons(table) {
					var replacement = 
					{
						'ui-icon-seek-first' : 'icon-double-angle-left bigger-140',
						'ui-icon-seek-prev' : 'icon-angle-left bigger-140',
						'ui-icon-seek-next' : 'icon-angle-right bigger-140',
						'ui-icon-seek-end' : 'icon-double-angle-right bigger-140'
					};
					$('.ui-pg-table:not(.navtable) > tbody > tr > .ui-pg-button > .ui-icon').each(function(){
						var icon = $(this);
						var $class = $.trim(icon.attr('class').replace('ui-icon', ''));
						if($class in replacement) icon.attr('class', 'ui-icon '+replacement[$class]);
					})
				}	

				function enableTooltips(table) {
					$('.navtable .ui-pg-button').tooltip({container:'body'});
					$(table).find('.ui-pg-div').tooltip({container:'body'});
				}
	$("#addBut").click(function (){ 
		userDialog("add");
	})
	//修改
	$("#updateBut").click(function(){
		var rowdata=ifOneAndData("user-table");
		if(rowdata){
			showUpdate(rowdata.id);
		}
	})
	//删除
	$("#delBut").click(function(){
		var rowdata=ifOneAndData("user-table");
		if(rowdata){
			$('#removeDiv').dialog({
			resizable: false,
			modal: true,
			width: 300,
			title: "警告",
			title_html: true,
			buttons: [
				{
					html: "<i class='icon-trash bigger-110'></i>&nbsp; Delete ",
					"class" : "btn btn-xs btn-danger",
					click: function() {
						$( this ).dialog( "close" );
					}
				}
				,
				{
					html: "<i class='icon-remove bigger-110'></i>&nbsp; Cancel",
					"class" : "btn btn-xs",
					click: function() {
						$( this ).dialog( "close" );
					}
				}
			]
			});
			$('#removeDiv').dialog('open');
		}
			
	})
})
function userDialog(opType){
	$('#addDiv').dialog({
	    autoOpen: false,
	    width: 800,
	    title:"新增",
		buttons: [
					{
						html: "<i class='icon-ok bigger-110'></i>&nbsp;保存",
						"class" : "btn btn-xs btn-success",
						click: function() {
							if($("#usableFlag").val()=="no"){
								$("#usableFlag").val("0")
							}else{
								$("#usableFlag").val("1")
							}
							saveOrUpdate(opType);
						}
					}
					,
					{
						html: "<i class='icon-remove bigger-110'></i>&nbsp; 取消",
						"class" : "btn btn-xs",
						click: function() {
							$( this ).dialog( "close" );
						}
					}
				]
	});
	$('#addDiv').dialog('open');
}
function showUpdate(id){
	$.ajax({
		type : 'POST',
		data : {
			id : id
		},
		url : '/user/showUpdate',
		datatype : "json",
		success : function(data) {
			if (data) {
				$("#userName").val(data.name);
				$("#loginName").val(data.loginName);
				$("#passWord").val(data.passWord);
				var usableFlag=data.usableFlag=='1'?'no':'yes';
				$("#usableFlag").val(usableFlag);
				$("#userId").val(data.id);
				userDialog("update");
			} else {
				
			}
		},
		error : function(data) {
		}
	});
}
/**
 * 保存 
 * @param opType 操作类型
 */
function saveOrUpdate(opType){
	var url=opType="add"?"/user/save":"/user/update";
	var params = $("#userForm").serializeObject();
	$.ajax({
		type : 'POST',
		data :params,
		url : url,
		datatype : "json",
		success : function(data) {
			if (data.success==true) {
				$('#addDiv').dialog('close');
				loadParam();
			} else {
			}
		},
		error : function(data) {
			$('#addDiv').dialog('close');
		}
	});
}


//判断jqGrid只能选择一条进行编辑，并返回该条数据
function ifOneAndData(jqGridID){
    var rowData = null;
    var selectedRowIds = $("#" + jqGridID).jqGrid('getGridParam', 'selarrrow');
    if (selectedRowIds.length == 0) {
    	alert("请选择一条记录!");
        return null;
    }
    else 
        if (selectedRowIds.length > 1) {
            alert("每次只能对一条记录进行编辑!");
            return null;
        }
        else {
            rowData = $("#" + jqGridID).jqGrid("getRowData", selectedRowIds[0]);
        }
    return rowData;
}

function loadParam(params){
    var postData = $("#user-table").jqGrid("getGridParam", "postData");   
    //将查询参数融入postData选项对象
    $.extend(postData, params);   
    $("#user-table").jqGrid("setGridParam", { 
        search: true
    }).trigger("reloadGrid", [{page:1}]);   // (7)重新载入Grid表格，以使上述设置生效 
}

			